<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="tfn" uri="http://www.totoro.com/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<div id="hd" style="background-color: ${fn:length(shop.shopCategoryBackgroundColor)>0 ?shop.shopCategoryBackgroundColor:'#102762'}">
    <div class="layout grid-m J_TLayout" >
        <div class="col-main">
            <div class="main-wrap J_TRegion">
                <div class="J_TModule" >
                    <div class="skin-box tb-module tshop-pbsm tshop-pbsm-shop-custom-banner"style="position: relative;">
                        <s class="skin-box-tp"><b></b></s>
                        <div class="skin-box-hd disappear">
                            <i class="hd-icon"></i>
                            <h3><span>店标</span></h3>
                            <div class="skin-box-act">
                                <a href="#" class="more">更多</a>
                            </div>
                        </div>
                        <div class="skin-box-bd" style="height: auto !important; background-color: ${fn:length(shop.shopCategoryBackgroundColor)>0 ?shop.shopCategoryBackgroundColor:'#102762'}">
                            <div>
                                <div class="banner-box">
                                    <p><img
                                            src="${fn:length(shop.shopImage) > 0?'/static/img/seller/shop/'+=shop.shopImage:''}">
                                    </p>
                                </div>
                            </div>
                        </div>
                        <s class="skin-box-bt"><b></b></s>
                    </div>
                </div>
                <div class="J_TModule">
                    <div class="skin-box tb-module tshop-pbsm tshop-pbsm-shop-nav-ch "
                         style="display: block; visibility: visible;">
                        <s class="skin-box-tp"><b></b></s>
                        <div class="skin-box-bd" style="height: auto !important; background-color: ${fn:length(shop.shopCategoryBackgroundColor)>0 ?shop.shopCategoryBackgroundColor:'#102762'}">
                            <div class="all-cats popup-container">
                                <div class="all-cats-trigger popup-trigger">
                                    <a class="link " href="" style="background-color: ${fn:length(shop.shopCategoryBackgroundColor)>0 ?shop.shopCategoryBackgroundColor:'#102762'}">
													<span class="title" style="color: ${fn:length(shop.shopCategoryForegroundColor)> 0?shop.shopCategoryForegroundColor:'#fff'}">
														本店所有商品
													</span>
                                        <i class="popup-icon"></i>
                                    </a>
                                </div>

                            </div>
                            <ul class="menu-list">
                                <li class="menu ${empty param.shopCategory?'menu-selected':''}" >
                                    <a class="link" href="/shop/view_shop.htm?brandId=${param.brandId}"><span class="title" style="color: ${fn:length(shop.shopCategoryForegroundColor)> 0?shop.shopCategoryForegroundColor:'#fff'}">首页</span></a>
                                </li>
                                <c:forEach items="${allCategory}" var="shopCategory" varStatus="vs">
                                    <li class="menu ${param.shopCategory == shopCategory.value.id?'menu-selected':''}">
                                        <a class="link" href="/shop/category.htm?brandId=${param.brandId}&shopCategory=${shopCategory.value.id}"
                                           target="_blank" ><span class="title" style="color: ${fn:length(shop.shopCategoryForegroundColor)> 0?shop.shopCategoryForegroundColor:'#fff'}">${shopCategory.value.scName}</span></a>
                                    </li>
                                </c:forEach>
                            </ul>
                        </div>
                        <s class="skin-box-bt"><b></b></s>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>
<script>
    $(function(){
        $(".popup-container").hover(function(){
            $(".all-cats-popup").removeClass("popup-hidden overlay-hidden");
        },function(){
            $(".all-cats-popup").addClass("popup-hidden overlay-hidden");
        });

        $(".all-cats-popup").mouseenter(function(){
            $(this).removeClass("popup-hidden overlay-hidden");
        }).mouseleave(function(){
            $(this).addClass("popup-hidden overlay-hidden");
        });
    });
</script>
